<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>gotoCaseDetailContentPageForm</title>
    <style>
    table{border-collapse:collapse;border-spacing:0;border-left:1px solid #888;border-top:1px solid #888;margin: auto}
    th,td{border-right:1px solid #888;border-bottom:1px solid #888;padding:5px 15px;}
    th{font-weight:bold;}
    body{text-align: center}
    </style>
    {% load static %}
    <script type='text/javascript' src="/static/js/jquery.min.js"></script>
    <script type='text/javascript' src="/static/js/user.js"></script>
    <script type="text/javascript">
        function deleteUploadFile(id){
            var csrf = $("input[name='csrfmiddlewaretoken']").val();
            $.ajax({
                url:'/deleteImg/',
                data:{imgId:id,csrfmiddlewaretoken:csrf},
                type:'POST',
                success:function(data){
                    if(data=='1'){
                        alert('删除成功');
                        $("#"+id+"").remove();
                    }else{
                        alert('删除失败');
                    }
                }
            });
        }
        $(document).ready(function(){
            $("input[name='submitResult']").click(function(){
                var name = $(this).attr("id");
                state='0';
                if(name=='pass'){
                    state='1';
                }
                var reason = $("#failReason").val();
                var title = $("#bugTitle").val();
                if(reason=='' && name=='fail'){
                    alert('请输入内容');
                    return false;
                }
                if(title=='' && name=='fail'){
                    alert('请输入bug描述');
                    return false;
                }
                var projectId = $("#projectId").val();
                var caseTitleId = $("#caseTitleId").val();
                var caseDetailId = $("#caseDetailId").val();
                var stage = $("#stage").val()=='SIT'?1:2;
                var machineId = $("#noteBookId").val();
                var csrf = $("input[name='csrfmiddlewaretoken']").val();
                $.ajax({
                    url:'/submitFailReason/',
                    type:'POST',
                    data:{machineId:machineId,stage:stage,bugTitle:title,state:state,projectId:projectId,caseTitleId:caseTitleId,caseDetailId:caseDetailId,failReason:reason,csrfmiddlewaretoken:csrf},
                    success:function(data){
                        if(data=='1'){
                            alert('提交成功');
                        }else{
                            alert('提交失败');
                        }
                    }
                });
            });

            $("#closeBugBox").click(function(){
                $("#bugTable").hide();
            });

            $("#addFile").click(function(){
                $(this).parent().parent().after("<tr><td style='text-align: left'><table><tr><td>" +
                    "<form method='post' enctype='multipart/form-data' action='/submitFile/'><input type='file' name='submitFile' /></form></td>" +
                    "<td><input type='button' value='确定' class='submitFile'/>&nbsp;&nbsp;<input type='button' value='取消' class='removeTr'/></td></tr></table></td></tr>");
            });

            $("body").on("click",".removeTr",function(){
                $(this).parent().parent().parent().parent().parent().remove();
            });


            $("input[name='submitFileButton']").click(function(){
                if($("input[name='file']").val()==''){
                    return false;
                }
                var form = new FormData();
                form.append('file',$("#file")[0].files[0]);
                form.append('csrfmiddlewaretoken',$("input[name='csrfmiddlewaretoken']").val())
                form.append('projectId',$("#projectId").val());
                form.append('caseTitleId',$("#caseTitleId").val());
                form.append('caseDetailId',$("#caseDetailId").val());
                $.ajax({
                    url:'/uploadFile/',
                    type:'POST',
                    data:form,
                    processData:false, //告诉jQuery不要去处理发送的数据
                    contentType:false,// 告诉jQuery不要去设置Content-Type请求头
                    success:function(data){
                        jsonData = $.parseJSON(data);
                        if(jsonData.data=='1'){
                            alert('上传成功');
                            $("#uploadFileTd").append("<label id='"+jsonData.uploadId+"'>"+jsonData.fileName+"&nbsp;&nbsp;<a href='#' onclick='"+"deleteUploadFile("+jsonData.uploadId+")'>删除</a></label>")
                        }
                        if(jsonData.data=='0'){
                            alert('上传失败');
                        }
                        if(jsonData.data=='2'){
                            alert('文件名重复');
                        }
                    }
                });
            });
        });
    </script>
</head>
<body>
<div style="width: 80%;height:40px;background-color: aqua;margin: 0 auto ">
    <div style="float:right;margin-right:10px;margin-top: 10px"><a href="#" name="logout">退出</a></div>
    <div style="float:right;margin-right:10px;margin-top: 10px">登录人：{{ request.session.showName }}&nbsp;&nbsp;</div>
    <form method="post" name="dataForm">
        {% csrf_token %}
        <input type="hidden" name="dataInput" />
    </form>
</div><p>
    <table>
        <tr>
            <td width="800px" style="text-align: left">
                正在测试：{{ project.projectName }}&nbsp;&nbsp;->&nbsp;&nbsp;{{ caseTitle.caseTitle }}&nbsp;&nbsp;->&nbsp;&nbsp;{{ caseDetail.caseDetailTitle }}&nbsp;&nbsp;->&nbsp;&nbsp;{{ stage }}&nbsp;&nbsp;->&nbsp;&nbsp;{{ noteBook.name }}
                <input type="hidden" value="{{ project.id }}" id="projectId" />
                <input type="hidden" value="{{ caseTitle.id }}" id="caseTitleId" />
                <input type="hidden" value="{{ caseDetail.id }}" id="caseDetailId" />
            </td>
        </tr>
        <tr style="font-size: small">
            <td style="text-align: left" >
                {% autoescape off %}
                {{ caseDetail.caseContent }}
                {% endautoescape %}
            </td>
        </tr>
    </table>
    <p>
    <table>
        <tr>
            <td style="text-align: left;"><input name="bugTitle" id="bugTitle" style="width: 550px" value="{{ title }}"></td>
        </tr>
        <tr>
            <td style="text-align: left">
                <textarea rows="10" cols="80" id="failReason">{{ reason }}</textarea><br>
            </td>
        </tr>
    <tr>
        <td>
            <input type="button" value="pass" name="submitResult" id="pass" style="background-color: green"/>
            <input type="button" value="&nbsp;提交Fail&nbsp;" name="submitResult" id="fail" style="background-color: red"/>
        </td>
    </tr>
    <tr>
            <td style="text-align: left">
                <form action="/uploadFile/" name="uploadForm" enctype="multipart/form-data" method="post">
                    {% csrf_token %}
                    <input type="file" name="file" id="file"/>
                    <input type="button" value="提交" name="submitFileButton"/>
                </form>
            </td>
        </tr>
    <tr>
        <td style="text-align: left" id="uploadFileTd"><label id="uploadFileName">上传的文件:</label>
        {% for img in imgs %}
                <a href="/showImage/?imgSrc={{ img.img }}" target="_blank"><label id="{{ img.id }}">{{ img.imgName }}</a>
                <a href="#" onclick="deleteUploadFile({{ img.id }})">删除</a>&nbsp;&nbsp;</label>
        {% endfor  %}
        </td>
    </tr>
    </table>
<input type="hidden" name="stage" value="{{ stage }}" id="stage"/>
<input type="hidden" name="noteBookId" value="{{ noteBook.id }}" id="noteBookId" />
</body>
</html>